<template>
  <div>
    <!-- 卡片 -->
    <div>
      <!-- {{WaiterOrder}} -->
      <el-card :body-style="{ width: '400px' }" shadow='hover '>
        <div class='cardHeader'>
          <img src=' http://134.175.100.63:8686/group1/M00/00/01/rBAABV6j59yASucYAAI_qzx88Jw23.jpeg' class="image">
          <!-- {{WaiterOrder.imgPhoto}} -->
          {{WaiterOrder.realname}}
        </div>
      <div style="padding: 14px;">
        <div>
          联系方式: {{WaiterOrder.telephone}}
        </div>
        <div>
          状态: {{WaiterOrder.status}}
        </div>
        <div>
          地址: {{WaiterOrder.province+WaiterOrder.city}}
        </div>
      </div>
    </el-card>
    </div>
  </div>
</template>

<script>
import { mapActions, mapState } from 'vuex';
export default {
  data() {
    return {
      id:this.$route.params.id,
    };
  },
  computed: {
    ...mapState('waiter',['WaiterOrder'])
  },
  methods: {
    ...mapActions('waiter',['findWaiterById']),
    
  },
  created() {
    this.findWaiterById({id:this.id})
  },
  mounted() {}
};
</script>
<style lang="less" scoped>
.cardHeader{
  text-align: center;
  display: block;
}
</style>
